/**
 * 外部渠道发布预览
 */
import React, { useState } from 'react';
import { Row, Col, message } from 'antd';
import { useRequest, defaultFormatResult } from '@/hooks';
// import { RankForm } from '../containers';
import { history } from 'umi';
import { sameTabProps } from '@/utils/tab';
import {
    BossForm,
    XMRCForm,
    OfficialWebsitePreviewForm,
    LiepinForm,
    LagouForm,
    MaimaiForm,
    LinkedinForm
} from '../containers';
import { DemandFieldUpdate, PostDetail } from './containers';
import { getRecruitOutwards } from '../service';

const codeMapping = {
    bosszp: BossForm,
    xmrc: XMRCForm,
    official_website: OfficialWebsitePreviewForm,
    wechat_public: OfficialWebsitePreviewForm,
    liepin: LiepinForm,
    lagou: LagouForm,
    mmzp: MaimaiForm,
    linkedin: LinkedinForm
};
function ChannelForm({ location }) {
    const { query } = location;
    const { recruitId, outwardId, code } = query;
    const [curFormKey, setCurFormKey] = useState(code);
    const { data: recruitData = {}, loading: recruitLoading, run: recruitRun } = useRequest(
        () => getRecruitOutwards(recruitId),
        {
            refreshDeps: [recruitId],
            ...defaultFormatResult
        }
    );
    const handleRefresh = () => {
        const uid = Number(
            Math.random()
                .toString()
                .substr(3, 14) + Date.now()
        ).toString(36);
        setCurFormKey(uid);
        recruitRun();
    };
    const internalFlag = code === 'official_website' || code === 'wechat_public';
    const handleSuccess = React.useCallback(
        msg => {
            message.success(msg);
            history.push({
                pathname: '/office/personnelManagement/recruitment/channel',
                query: {
                    recruitCode: recruitId
                },
                ...sameTabProps
            });
        },
        [recruitId]
    );
    const handleError = React.useCallback(msg => {
        message.success(msg);
    }, []);
    const renderForm = () => {
        const Comp = codeMapping[code];
        return (
            <Comp
                key={curFormKey}
                outwardId={outwardId}
                onSuccess={handleSuccess}
                onError={handleError}
                channelCode={code}
            />
        );
    };
    return (
        <div style={{ margin: '16px' }}>
            <DemandFieldUpdate style={{ marginBottom: 0 }} onRefresh={handleRefresh} outwardId={outwardId} />
            <Row gutter={16}>
                {!internalFlag && (
                    <Col span={12}>
                        <PostDetail data={recruitData} loading={recruitLoading} />
                    </Col>
                )}
                <Col span={!internalFlag ? 12 : 24}>{renderForm()}</Col>
            </Row>
        </div>
    );
}

export default ChannelForm;
